<!doctype html>
<html>
<body>
    <div style="display:flex;align-items:center;">
        <img src="../../data/test_sunrise.jpg" id="sunrise_img" width="20%">
    </div>
    <br/>
    <div>
        <h3>result:</h3>
        <textarea id="result" rows="30" cols="100"></textarea>
    </div>

    <script src="../../../flycv.js" type="text/javascript"></script>
    <script type="text/javascript">
        let resultHtml = document.getElementById("result");

        fcv.then((fcv) => {
            // 读取图像，构造mat数据
            let srcRgba = fcv.imread("sunrise_img");

            // 构造mean、std数据
            let meanParams = new fcv.VectorFloat();
            let stdParams = new fcv.VectorFloat();
            let orderIndex = new fcv.VectorUInt();

            meanParams.push_back(23.0);
            meanParams.push_back(23.0);
            meanParams.push_back(23.0);
            stdParams.push_back(1.0);
            stdParams.push_back(2.0);
            stdParams.push_back(3.0);
            orderIndex.push_back(2);
            orderIndex.push_back(1);
            orderIndex.push_back(0);

            // todo：normalizeToSubmeanToReorder当前只支持三通道输入
            let srcRgb = new fcv.Mat();
            fcv.cvtColor(srcRgba, srcRgb, fcv.ColorConvertType.CVT_PA_RGBA2PA_RGB);

            let dst = new fcv.Mat();
            fcv.normalizeToSubmeanToReorder(srcRgb, meanParams, stdParams, orderIndex, dst, 0);

            // 可视化
            resultHtml.append(dst.data().toString());

            // 内存回收
            srcRgba.delete();
            srcRgb.delete();
            dst.delete();
        });
    </script>
</body>
</html>